<template>
  <CDialog
    :visible="visible"
    :title="title"
    width="500px"
    @outerOpen="outerOpen"
    @cancel="handleCancel"
    top="10vh"
  >
    <div v-if="stationId != 0">电站ID是：{{ stationId }}</div>
    <div>
      <p>*该功能正在免费试用期</p>
      <i-form :items="items" :model="form" :rules="rules" ref="form"> </i-form>
      <p v-if="stationId == 0">
        注：设置后所有投保电站都设置为此价格，之前设置的价格在此设置后将被覆盖
      </p>
    </div>
    <template slot="outerFooter">
      <el-button type="success" @click="handleSubmit">确定</el-button>
    </template>
  </CDialog>
</template>
<script>
import CDialog from '@/components/CDialog'
import formValidate from '@/utils/validate'
import { editStationPremium } from '@/api/Insurance'
export default {
  name: 'InsuranceSet',
  components: { CDialog },
  props: {
    visible: {
      type: Boolean,
      required: true,
    },
    stationId: {
      type: Number,
      default: () => {},
      required: true,
    },
  },
  data() {
    return {
      title: '',
      form: {},
      items: [
        {
          label: '保险价格',
          value: 'premium',
          type: 'text',
          showInForm: true,
          required: true,
          placeholder: '请输入保险价格',
        },
      ],
      rules: {
        premium: [
          {
            required: true,
            message: '请输入保险价格',
          },
          {
            validator: formValidate('vailddateNumber'),
          },
        ],
      },
    }
  },
  created() {
    console.log('组件被创建')
  },
  updated() {
    if (this.stationId == 0) {
      // 一键设置
      this.title = '一键设置保险费'
    } else {
      this.title = '设置保险费'
    }
  },
  computed: {},
  methods: {
    handleSubmit() {
      let validate = true
      this.$refs.form.validate((valid) => {
        if (!valid) validate = false
      })

      if (!validate) return

      var params = {
        premium: this.form.premium,
      }
      if (this.stationId != 0) {
        //一键设置
        params['id'] = this.stationId
      }
      console.log(params)
      editStationPremium(params)
        .then(() => {
          this.$message({
            type: 'success',
            showClose: true,
            message: '操作成功',
          })
          this.$emit('update:visible', false)
          this.refresh()
        })
        .catch((err) => {
          console.log(err)
        })
    },
    handleCancel() {
      this.$emit('update:visible', false)
    },
    outerOpen() {},
  },
}
</script>
